/**
 * @file
 * @auth zhaojing
 * @date 2017/01/19
 */

import Vue from 'vue';
import util from '../../../common/util';
import commonService from '../../../common/commonService';
import tpl from './tpl.html';
import filter from '../../../../grsc-base/util/filter';
import Loading from '../../../../grsc-base/component/Loading.vue';
import NoData from '../../../../grsc-base/component/NoData.vue'


export default Vue.extend({
    name: 'realDeal',
    template: tpl,
    components: {
        Loading,
        NoData
    },
    data() {
        return {
            isLoading: true,
            filter: filter,
            priceBuy: false,
            priceSell: false,
            isRed: false,
            isGreen: false,
            socket: null,
            timer: null,


            // orderListDis: [],
            oldOrderList: [],
            orderList: [],
            domList: []
        }
    },
    props:{
        wsSymbol: {
            type: String,
            default: 'USD_GOP'
        },
        tradeType: {
            type: String,
            default: 'GOP'
        },
        height: {
            type: Number,
            default: ''
        }
    },
    computed: {},
    watch: {
        height(newVal, oldVal) {
            let dom = this.$refs.content;
            const HEIGHT_THEAD = 36;

            dom.style.height = (newVal - HEIGHT_THEAD) + 'px';
        }
    },
    created() {
        this._loopTrade();
        $(document).off('$$pan.LiveTrade').on('$$pan.LiveTrade', () => {
            this._loopTradeOnce();
        });


    },
    mounted() {

    },
    beforeDestroy(){
        clearInterval(this.timer);
    },
    methods: {
        // _compose(cur, old){
        _compose(curArr, oldArr){
            let cur = JSON.parse(JSON.stringify(curArr));
            let old = JSON.parse(JSON.stringify(oldArr));
            if(!old.length){
                this.domList = cur;
                return cur;
            }
            let resArr = [];

            for(var i=0; i<cur.length; i++){
                let n = 0;
                let curItem = cur[i];
                for(var j=0; j<old.length; j++){
                    let oldItem = old[j];
                    if(curItem.num === oldItem.num && curItem.price === oldItem.price && curItem.time === oldItem.time && curItem.type === oldItem.type ){
                        continue;
                    }else{
                        n+=1;
                    } 
                }
                if(n===(old.length)) {
                    curItem.isAdd = true;
                    curItem.isAnimated = false;
                    resArr.push(curItem);
                }
            }

            setTimeout(() => {
                resArr.forEach((item, index)=>{
                    item.isAnimated = true;
                });
            }, 1000);

            let returnArr = resArr.concat(old);

            this.domList = resArr.concat(this.domList);

            
            if (this.domList.length > 200) {
                this.domList = this.domList.slice(0, 100);
            }

            // console.log(JSON.stringify(returnArr),'================================================');

            return returnArr;

        },
        _loopTradeOnce() {
            commonService.loopTradeInfo({
                symbol: this.wsSymbol
            }).done(rep => {
                this._doResult(rep);
            });
        },

        _doResult(rep) {
            this.isLoading = false;
            let orderList = [];
            let orders;
            let temp;

            if (rep['order']) {
                orders = rep.order;

                if (orders.length !== 0) {
                    if (orders.length > 59) {
                        orders = orders.slice(0, 60);
                    }
                } else {
                    orders = [];
                }
                // console.log(orders);
                if (orders.length !== 0) {
                    for (let i = 0; i < orders.length; i++) {
                        temp = orders[i];
                        orderList.push({
                            "price": filter.floorFixPrice(temp.price, this.$$coinPrecision),
                            "num": temp.num,
                            "time": temp.time,
                            "type": temp.type
                        });
                    }
                }
            }

            setPriceText(orderList, this.$$highlightNo);
            this.orderList = orderList;

            // console.log(orderList);
            this._compose(orderList, this.oldOrderList);



            function setPriceText(list, no) {
                let lastItem;
                let len = list.length;
                let item;
                for (let i = len - 1; i >= 0; i--) {
                    item = list[i];
                    if (i === len - 1) {
                        item.priceText = util.getHighPriceText(item.price, item.type);
                    } else {
                        if (util.isDiffPrice(lastItem.price, item.price, no) === true) {
                            item.priceText = util.getHighPriceText(item.price, item.type);
                        } else {
                            item.priceText = util.getLowPriceText(item.price, no, item.type);
                        }
                    }
                    lastItem = item;
                }
            }
        },

        _loopTrade() {
            commonService.onLoopTradeInfo((rep) => {
                // 暂存上一个
                this.oldOrderList = this.orderList;
                this._doResult(rep);
            }, {
                symbol:this.wsSymbol
            });
        },


        /**
         * 设置价格
         */
        setPrice($event, price, amount) {
            $(document).trigger('$$market.SetPrice', [price, amount]);
        }
    }
});